.topcard{
height:32px;
padding-bottom : 5px;
}
.imagebox {
width: 100%;
height: 0;
position: relative;
padding-bottom: 56.2%;
padding-top:30px;
}
.image{
width: 100%;
}
.imagefail{
color:#C0C4CC;
background-color:#F5F7FA;
padding-top:26.1%;
padding-bottom: 30.1%;
text-align: center;
height:0;
}
.songname {
font-size: medium;
}

.artist {
font-size: x-small;
}

.easy {
background-color: #409EFF;
color: rgb(240, 249, 235);
width:36px;
}

.normal {
background-color: #67C23A;
color: rgb(236, 245, 255);
}

.hard {
background-color: #E6A23C;
color: rgb(253, 246, 236);
}

.expert {
background-color: #F56C6C;
color: rgb(254, 240, 240);
}

.special {
background-color: rgb(236, 65, 213);
color: rgb(238, 224, 236);
}

.difficulty {
float: right;
}

.cardclass {
min-width: 330px;
padding-bottom: 20px;
}

.metadata {
font-size: xx-small;
color: rgb(100, 100, 100);
}
.el-card{
    background-color: rgba(255,255,255,0.9);
}